﻿<UserControl x:Class="Stopwatch.Controls.StopwatchControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    d:DesignHeight="200" d:DesignWidth="378">

    <UserControl.Resources>
        <Style TargetType="TextBlock" x:Key="normalText">
            <Setter Property="FontSize" Value="120"/>
            <Setter Property="Margin" Value="0, -30, 0, 0"/>
        </Style>
        <Style TargetType="TextBlock" x:Key="normalTag">
            <Setter Property="FontSize" Value="120"/>
            <Setter Property="Margin" Value="0, -40, 0, 0"/>
        </Style>
        <Style TargetType="TextBlock" x:Key="smallText">
            <Setter Property="FontSize" Value="80"/>
            <Setter Property="Margin" Value="0, 12, 0, 0"/>
        </Style>
        <Style TargetType="TextBlock" x:Key="normalSubText">
            <Setter Property="FontSize" Value="45"/>
            <Setter Property="Margin" Value="0, -4, 0, 0"/>
        </Style>
        <Style TargetType="TextBlock" x:Key="normalSubTag">
            <Setter Property="FontSize" Value="45"/>
            <Setter Property="Margin" Value="0, -8, 0, 0"/>
        </Style>
    </UserControl.Resources>

    <Grid x:Name="LayoutRoot" HorizontalAlignment="Center" Width="378">
        <Grid.RowDefinitions>
            <RowDefinition Height="30" />
            <RowDefinition Height="110" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <Grid x:Name="hoursArea" Grid.Row="0" Visibility="Collapsed">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="100"/>
                <ColumnDefinition Width="50"/>
            </Grid.ColumnDefinitions>
            <TextBlock Grid.Column="0" x:Name="hours" Text="0" HorizontalAlignment="Center" />
            <TextBlock Grid.Column="1"  Text="hrs." />
        </Grid>
        <Grid x:Name="timer" Grid.Row="1">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="130"/>
                <ColumnDefinition Width="26"/>
                <ColumnDefinition Width="130"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <TextBlock Grid.Column="0" x:Name="minutes" Style="{StaticResource normalText}" Text="00" />
            <TextBlock Grid.Column="1" Style="{StaticResource normalTag}" Text=":" />
            <TextBlock Grid.Column="2" x:Name="seconds" Style="{StaticResource normalText}"  Text="00"/>
            <TextBlock Grid.Column="3" x:Name="milliseconds" Style="{StaticResource smallText}" Text="00"/>
        </Grid>
        <Grid x:Name="subTimer" Grid.Row="2" Visibility="Collapsed">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="200"/>
                <ColumnDefinition Width="50"/>
                <ColumnDefinition Width="10"/>
                <ColumnDefinition Width="50"/>
                <ColumnDefinition Width="10"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            
            <TextBlock Grid.Column="1" x:Name="subMinutes" 
                       Style="{StaticResource normalSubText}" 
                       Text="00"  
                       VerticalAlignment="Top" />
            
            <TextBlock Grid.Column="2" 
                       Style="{StaticResource normalSubTag}" 
                       Text=":"  
                       VerticalAlignment="Top"/>
            
            <TextBlock Grid.Column="3" x:Name="subSeconds" 
                       Style="{StaticResource normalSubText}" 
                       Text="00" 
                       VerticalAlignment="Top"/>
            
            <TextBlock Grid.Column="4" 
                       Style="{StaticResource normalSubTag}"
                       Text="."  
                       VerticalAlignment="Top"/>
            
            <TextBlock Grid.Column="5" x:Name="subMilliseconds" 
                       Style="{StaticResource normalSubText}" 
                       Text="00" 
                       VerticalAlignment="Top"/>
        </Grid>
    </Grid>
</UserControl>
